<?php echo $this->headMeta()->appendHttpEquiv('expires', 'Wed, 26 Feb 1997 08:21:57 GMT')
  ->appendHttpEquiv('pragma', 'no-cache')
   ->appendHttpEquiv('Cache-Control', 'no-store, no-cache, must-revalidate');

$this->headScript()
->appendFile($this->js('plugins/jquery.template.js'))
->appendFile($this->js('plugins/jquery.form.js'))
->appendFile($this->js('plugins/jquery.blockUI.js'))
->appendFile($this->js('jquery-ui/ui/jquery.ui.core.js'))
->appendFile($this->js('jquery-ui/ui/jquery.ui.dialog.js'))
->appendFile($this->js('jquery-ui/ui/jquery.ui.resizable.js'))
->appendFile($this->js('jquery-ui/ui/jquery.ui.draggable.js'))
->appendFile($this->js('plugins/jquery.selectboxes.js'))
	->captureStart()?>
var semesterCousrse = <?php echo $this->semesterCousrse?>;
var sdata = null;
var sel_scope = null;
var adata = new Array() ;
$(document).ready(function(){
	//$().ajaxStop($.unblockUI);
	initData();

	$("#sel_grade").change(function(){
		$("#sethead").hide();
		sel_scope = null;
		initData();
		$("#sethead").fadeIn("slow");


	});
	$("#year_semester").change(function(){
		$("#sethead").hide();
		sel_scope = null;
		initData();
		$("#sethead").fadeIn("slow");
	});

	var options = {
	    beforeSubmit: function(){
	    $('div.main_body').block({message:'<h1><?php echo $this->translate('Data setting ..')?></h1>',  border: '3px solid #f00' });
	    },
        success: function(data){
        $('div.main_body').unblock();
        sel_scope = null;
        $("#del_sn").attr('value','');

        if (data == '0')
            alert('<?php echo $this->translate('There Course Scheduling information can not be deleted')?>');
        else
        initData();
        }
	}

	$('#myform').ajaxForm(options);



});

// 取得伺服器資料
function initData() {
	var year_semester = $("#year_semester").val();
	var grade = $("#sel_grade").val();
	var url = '<?php echo $this->baseScript ?>/getset/year_semester/'+year_semester+'/grade/'+grade;
	$.getJSON(url,
	function(data){
		sdata = data;
		if (sdata.length == 0){
			$("#mantable").show();
			$("#addArea").hide();
		}
		else {
			$("#mantable").hide();
			$("#addArea").show();
		}
		initTable();
	});
	$("#sel_scope").removeOption(/./);
	$("#sel_scope").addOption({'':'select ..'});
	$("#sel_scope").addOption(semesterCousrse[grade], false);


}

// 初始化 表格
function initTable(){
	var grade = $("#sel_grade").val(); // 年級
	//var grade_data = sdata[grade]; //年級科目
	var grade_data = sdata;
	$("#scopeData").empty();
	var nor =  '<td >${name}</td><td align="center">${special}</td><td align="center">${rank}</td><td align="center" sn="${sn}"><img src="${img2}"> <a href="#" class="edit"><?php echo $this->translate('edit')?></a> ${delbtn} </td>';
	var t1 = $.template('<tr id="${id}"><td rowspan="${i}" align="right">${scope} <a href="#" ><img src="${img1}"></a></td>'+nor+'</tr>${appendRow}');
	var t2 = $.template('<tr id="${id}">'+nor+'</tr>${appendRow}');
	var len = grade_data.length;
	var r =0;
	$.each(grade_data,function(s,v){
		vlen = v.length;
		if (sel_scope == s) {
			vlen++;
		}
		for(i=0; i < v.length ;i++){
			if (i == 0) var st = t1; else st = t2;
			if (v[i].special=='Y') var spe = '<?php echo $this->translate('yes')?>'; else  var spe = '<?php echo $this->translate('no')?>';
			var scope_rank = v[i].scope_rank;
			var rank = v[i].rank;

			if (vlen>1){
				var arank = scope_rank+'-'+rank;
			} else {
			 	var arank = scope_rank;
			}
			if (v[i].required==0)
				var delbtn = '<a href="#" class="delete"><?php echo $this->translate('delete')?></a>';
			$("#scopeData").append(st, {
				id   : 'sn-'+v[i].sn,
				i	 : vlen,
				sn   : v[i].sn,
				scope: s ,
				img1  : '<?php echo $this->img('explode.png')?>',
				img2  : '<?php echo $this->img('edit.png')?>',
				name : v[i].name,
				special : spe,
				rank : arank,
				delbtn: delbtn
				});
		}
		if (sel_scope == s) {
			var adata = $.template('<tr id="append_row"><td><input type="text" id="subject_name" name="subject_name" size="10" /></td><td align="center"><input type="checkbox" name="special" value="Y"> <?php echo $this->translate('yes')?></td><td><input type="hidden" name="scope_rank" value="${scope_rank}" >${scope_rank} - <input type="text" name="rank" size="2" value="${rank}"/></td><td><input type="submit" id="act" value="<?php echo $this->translate('append')?>" /> <input type="button" id="cancel" value="<?php echo $this->translate('cancel')?>" /></td></tr>');
			$("#scopeData").append(adata,{
				scope_rank : scope_rank,
				rank : parseInt(rank)+1
			});

		}

	});
	 $("#scopeData tr:even").css("background", "#fee");

	 $("#scopeData  a").click(function(){
	 	$("#append_row").empty();
	 	sel_scope = $.trim($(this).parent().text());
	 	sn = $(this).parent().attr('sn');
	 	$("#hidden_scope").attr('value',sel_scope);
	 	var act = $(this).attr('class');
	 	if (act == 'edit'){
	 		var aparent = $(this).parent();
	 		var rank = aparent.prev();
	 		var arr = rank.text().split("-");
	 		var rank_html = '<input type="text" name="scope_rank" size="1" value="'+arr[0]+'">';
	 		if (arr[1]) {
	 			rank_html += '-<input type="text" name="rank" size="1" value="'+arr[1]+'">';
	 		}
	 		rank.html(rank_html);

	 		var special = aparent.prev().prev();
	 		if(special.text()=='<?php echo $this->translate('no')?>') {
	 			special.html('<input type="checkbox" name="special" value="Y"> <?php echo $this->translate('yes')?>');
	 		}
	 		else {
	 			special.html('<input type="checkbox" name="special" value="Y" checked> <?php echo $this->translate('yes')?>');
	 		}
	 		var sub = aparent.prev().prev().prev();
	 		sub.html('<input type="text" name="subject_name" size=8 value="'+sub.text()+'">');

	 		$(this).parent().html('<input type="hidden" name="edit_sn" value="'+sn+'"/><input type="submit" name="act" value="<?php echo $this->translate('confirm')?>" /> <input type="button" id="cancel2" value="<?php echo $this->translate('cancel')?>" />');


	 		$("#scopeData a").css({background:'#ccc',color:'#fff'});
	 		$("#scopeData a").unbind('click');
	 	}
	 	else if (act == 'delete') {
	 		if (confirm('<?php echo $this->translate('confirm delete ?')?>')) {
	 		// 設定為刪除模式
	 		$("#del_sn").attr('value',sn);
	 		$("#myform").submit();
	 		}
	 	}
	 	else
	 		initTable();

	 	$("#subject_name").focus();

	 	$("#cancel2").click(function(){
	 		sel_scope = null;
	 		initTable();
	 	});
	 });

	 $("#cancel").click(function(){
	 	sel_scope = null;
	 	initTable();
	 });
}


$(document).ready(function(){
	// 自動加入課程
		$("#auto_seme").click(function(){
			var year_semester = $("#year_semester").val();
			var grade = $("#sel_grade").val();
			var url = '<?php echo $this->baseScript ?>/autocourse/year_semester/'+year_semester+'/grade/'+grade;
			$.getJSON(url,
				function(data){
					$("#sel_grade").trigger('change');
			});
		});

	// 複製課程
	$("#copy_seme").click(function(){
		var year_semester = $("#year_semester").val();
		var grade = $("#sel_grade").val();

		var url = '<?php echo $this->baseScript ?>/getsemedata/year_semester/'+year_semester+'/grade/'+grade;
		$.getJSON(url,
		function(data){
			$("#select_seme").empty();
			var t = $.template('<option value="${sn}"><?php echo $this->translate('${year} year ${semester}th semester,${grade} grade course')?></option>');
			$.each(data,function(i,v){
				if (year_semester == (v.year+'-'+v.semester) &&  grade == v.grade){
				}
				else {
					$("#select_seme").append(t,{
					sn : v.sn,
					year : v.year,
					semester : v.semester,
					grade: v.grade
					});
				}
			});

		});
		// 複製課程
		$("#do_copy").click(function(){
			var url = '<?php echo $this->baseScript ?>/copycourse/year_semester/'+year_semester+'/grade/'+grade+'/source_sn/'+$("#select_seme").val();
			$.getJSON(url,
				function(data){
					$("#semeList").dialog("close");
					if (data == 1) {
						$("#sel_grade").trigger('change');
					}
				}
			);
		});


		$("#semeList").show();
		$("#semeList").dialog({modal:true,overlay:true});
		$("#semeList").dialog("open");
	});

		// 新增課程
		$("#appendBtn").click(function(){
			if ($("#subject_name").val()=='') {
				alert('<?php echo $this->translate('name')?>' + '<?php echo $this->translate("Value is required and can't be empty")?>');
				$("#subject_name").focus();
			}
			else if ($("#sel_scope").val()=='') {
				alert('<?php echo $this->translate('belong scope')?>' + '<?php echo $this->translate("Value is required and can't be empty")?>');
				$("#sel_scope").focus();
			}
			else {
				var scope = $("#sel_scope").val();
				var subject_name =  $("#subject_name").val();
				if ($("#special:checked").length >0 )
					var special = 'Y';
				else
					var special = 'N';
				var year_semester = $("#year_semester").val();
				var grade = $("#sel_grade").val();
				// 新增課程
				$.post("<?php echo $this->route('appendcourse')?>",
				{ year_semester: year_semester, grade: grade, scope: scope, subject_name: subject_name , special: special },
				 function(data){
					//console.log(data);
					initData();
				} );

				$("#sel_grade").trigger('change');
			}
		});

});

<?php echo $this->headScript()->captureEnd() ?>

<?php echo $this->headStyle()->captureStart() ?>
#settable {float:left;width:500px}
#settable table {width:100%;background:#ccc;border:#aaa solid thin}
#settable tr {background:#fff}
#settable td {padding:5px;white-space:nowrap}
#settable th {white-space:nowrap}
#settable img {border:0px}
.disabled {background:#ccc}
#mantable {float:right; width:120px;}
#addArea {float:left;margin-left:40px; padding:5px;border:#cce thin solid}
.flora p {margin:20px;font-size:large}
<?php echo $this->headStyle()->captureEnd() ?>
<div class="main_body">
<form action="<?php echo $this->baseScript?>/edit" method="post" id="myform">
<div id="settable">
<table width="80%" >
<thead>
<tr>
<th colspan="5" style="text-align:center" id="sethead">
<select name="year_semester" id="year_semester">
<?php echo  $this->YearSemesterOptions($this->year_semester)?>
</select>
<select name='sel_grade' id="sel_grade" >
<?php echo $this->ClassGradeOptions()?>
</select> <?php echo $this->translate('course list')?>
</th>
</tr>
<tr>
<th width="40"><?php echo $this->translate('scope')?></th>
<th><?php echo $this->translate('name')?></th>
<th><?php echo $this->translate('special')?></th>
<th><?php echo $this->translate('rank')?></th>
<th><?php echo $this->translate('edit')?></th>
</tr>
</thead>
<tbody id="scopeData">
</tbody>
</table>
</div>
<div id="mantable">
<p><span class="like_button"><a href="#" id="copy_seme"><?php echo $this->translate('quick copy')?></a></span></p>
<p><span class="like_button"><a href="#" id="auto_seme" class="like_button"><?php echo $this->translate('Automatically')?></a></span></p>
<div id="semeList" class="flora" title="<?php echo $this->translate('copy subject')?>" style="display:none">
<p><?php echo $this->translate('select semester')?></p>
<p>
<select name="sel_seme_sn" id="select_seme"></select>
</p>
<input type="button" value="<?php echo $this->translate('copy subject')?>" id="do_copy">
</div>
</div>
<input type="hidden" name="scope" id="hidden_scope" />
<input type="hidden" name="del_sn" id="del_sn" />
</form>
</div>

<div id="addArea">
<h1><?php echo $this->translate('append course')?></h1>
<form id="appendCourseForm">
<dl>
<dt><label for="sel_scope"><?php echo $this->translate('belong scope')?></label></dt>
<dd>
<select id="sel_scope" name="sel_scope">
</select>
</dd>
</dl>
<dl>
<dt>
<label for="subject_name"><?php echo $this->translate('name')?></label>
</dt>
<dd>
<input type="text" id="subject_name" name="subject_name" size="12" />
</dd>
</dl>
<dl>
<dt><?php echo $this->translate('special')?></dt>
<dd><input type="checkbox" name="special" id="special" value="Y"/> <?php echo $this->translate('yes')?></dd>
</dl>
<input id="appendBtn" type="button" value="<?php echo $this->translate('append course')?>">
</form>
</div>

<div style="clear:both"></div>